<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <!-- import CSS -->
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
</head>
<body>
<div id="app">
   <!-- <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">

        <el-form-item label="模块名称" prop="type">
            <el-input v-model="queryParams.name"></el-input>
        </el-form-item>
        <el-form-item>
            <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
            <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
        </el-form-item>
    </el-form>

    &lt;!&ndash;功能条&ndash;&gt;
    <el-row :gutter="10" class="mb8">
        <el-col :span="1.5">
            <el-button
                    type="primary"
                    plain
                    icon="el-icon-plus"
                    size="mini"
                    @click="addRow"
            >新增</el-button>
        </el-col>
    </el-row>
    <el-table
            :data="tableData"
            style="width: 100%;height:100%"
            >
        <el-table-column
                fixed
                prop="personId"
                label="员工号"
                width="200">
        </el-table-column>
        <el-table-column
                prop="personName"
                label="员工名称"
                width="250">
        </el-table-column>
        <el-table-column
                prop="leaveDay"
                label="请假天数"
                width="120">
        </el-table-column>
        <el-table-column
                prop="metaInfo"
                label="详细描述"
                width="400">
        </el-table-column>
        <el-table-column
                prop="lastUpdateTime"
                label="上次更新时间"
                width="300">
        </el-table-column>
        <el-table-column
                prop="createTime"
                label="创建时间"
                width="300">
        </el-table-column>

        <el-table-column
                fixed="right"
                label="操作"
                width="200">
            <template slot-scope="scope">
                <el-button
                        @click.native.prevent="deployRow(scope.$index, tableData)"
                        type="text"
                        size="small">
                    发布
                </el-button>
                <el-button
                        @click.native.prevent="editRow(scope.$index, tableData)"
                        type="text"
                        size="small">
                    编辑
                </el-button>

                    <el-button
                            @click.native.prevent="deleteRow(scope.$index, tableData)"
                            type="text"
                            size="small">
                        删除
                    </el-button>
                </template>
            </template>

        </el-table-column>

    </el-table>
    <el-pagination
            style="float:right"
            @current-change="changePage"
            :current-page="pageNum"
            :page-sizes="[10, 20, 50, 100]"
            :page-size="pageSize"
            layout="total, sizes, prev, pager, next, jumper"
            :total="total">
    </el-pagination>-->
    <!-- 添加或修改【请填写功能名称】对话框 -->
    <div style="margin: 200px 0;"></div>
    <center>
                  <el-label><span style="size:50px">请假</span></el-label>
        <div style="margin: 20px 0;"></div>
        <el-form style="width:50%;height: 100%" ref="form" :model="form"  label-width="80px">

            <el-form-item label="员工号" prop="personId">
                <el-input v-model="form.personId"  readonly placeholder="请输入员工号" />
            </el-form-item>
            <el-form-item label="人员名称" prop="name">
                <el-input v-model="form.personName" placeholder="请输入人员名称" />
            </el-form-item>
            <el-form-item label="请假天数" prop="leaveDay">
                <el-input v-model="form.leaveDay" placeholder="请输入请假天数" />
            </el-form-item>
            <el-form-item label="部门" prop="dept">
                <el-input v-model="form.dept" placeholder="请输入部门" />
            </el-form-item>
            <el-form-item label="详细描述" prop="description">
                <el-input

                        type="textarea"
                        placeholder="请输入详细描述"
                        v-model="form.description"
                        maxlength="1000"
                        show-word-limit
                >
                </el-input>
           <!--     <el-input v-model="form.description" placeholder="" />-->
            </el-form-item>

        </el-form>
        <div slot="footer" class="dialog-footer">
            <el-button type="primary" @click="submitForm">提交</el-button>

        </div>
    </center>

</div>
</body>
<!-- import Vue before Element -->
<script  src="js/axios.js"></script>
<script  src="js/vue.js"></script>
<script   src="js/elementui.js"></script>
<script>
    new Vue({
        el: '#app',


        data() {
            return {
                form:{
                    personId:'10001'
                },

            }
        },
        methods: {
            submitForm(){
                this.$refs["form"].validate(valid => {
                    if (valid) {
                        if (this.form.id != null) {

                        } else {
                            axios.post(`/mybatisplus/leaveprocess/startLeaveProcess`,this.form).then(response => {
                                if(response.data.success){
                                    this.$message({message:'新增成功!',type:'success'});

                                }else{
                                    this.$message({message:'新增失败!',type:'warning'});
                                }
                            }).catch(error => {
                                this.$message({message:'新增异常!',type:'error'});

                            })
                        }
                    }
                });
           },

        },
    })
</script>
</html>
